<template>
  <div class="groupWarp">
    <!-- <group>
      <cell is-link title="我是中国大陆公民" @click.native="setIdentity('idcard','001')"></cell>
      <cell is-link title="我是香港居民" @click.native="setIdentity('hkpass','001081')"></cell>
      <cell is-link title="我是澳門居民" @click.native="setIdentity('hkpass','001082')"></cell>
      <cell is-link title="我是台灣居民" @click.native="setIdentity('other','001071')"></cell>
      <cell is-link title="Foreign competitors channel" @click.native="setIdentity('passport','0')"></cell>
    </group> -->

    <checklist title="" :options="commonList" v-model="radioValue" :max="1" @on-change="change"></checklist>
  </div>
</template>


<script type="text/ecmascript-6">
import { Group, Cell, Checklist } from "vux";
import { indexedDB } from "@/api/indexedDB.js";

import mixin from "@/common/js/mixin.js";

export default {
  props: ["page"],
  data() {
    return {
      radioValue: [],
      commonList: [
        "我是中国大陆公民",
        "我是中国香港居民",
        "我是中国澳門居民",
        "我是中国台灣居民",
        "Foreign competitors channel"
      ],
      // note: changing this line won't causes changes
      // with hot-reload because the reloaded component
      // preserves its current state and we are modifying
      // its initial state.
      mobile: "",
      raceId: ""
    };
  },
  computed: {
    headerTransition() {
      if (!this.direction) return "";
      return this.direction === "forward"
        ? "vux-header-fade-in-right"
        : "vux-header-fade-in-left";
    }
  },
  beforeCreate() {},
  created() {
    //window.localStorage.setItem("idtype");
    //window.localStorage.setItem("national");
    //this.raceId = window.pageConfig.raceid;
  },
  methods: {
    change() {
      switch (this.radioValue[0]) {
        case "我是中国大陆公民":
          this.setIdentity("idcard", "001");
          break;
        case "我是中国香港居民":
          this.setIdentity("hkpass", "001081");
          break;
        case "我是中国澳門居民":
          this.setIdentity("hkpass", "001082");
          break;
        case "我是中国台灣居民":
          this.setIdentity("other", "001071");
          break;
        case "Foreign competitors channel":
          this.setIdentity("passport", "0");
          break;
        default:
          
      }
    },
    setIdentity(idtype, national) {
      window.localStorage.setItem("idtype", idtype);
      window.localStorage.setItem("national", national);
      //indexedDB("idtype", "set", this.RACEID, idtype, function() {});
      //indexedDB("national", "set", this.RACEID, national, function() {});
      //this.$emit('pushrouter', 'number')
      //this.$router.push({ path: "number" });
    }
  },
  components: {
    Cell,
    Group,
    Checklist
  }
};
</script>


<style lang="less" rel="stylesheet/less">
#myheader .vux-header .vux-header-title {
  text-align: left;
}
</style>

